<template>
    <div class="discover">
        <div class="box">
            <!-- 视频 -->
            <div class="box_video">
                <video :src="list.video" loop muted autoplay></video>
            </div>
            <!-- 商品标题和左侧图标 -->
            <div class="box_center">
                <div class="title">
                    <span>@前海万联旗舰店</span>
                    <span>WanlShop阶梯拼团、直播种草、短视频</span>
                </div>
                <div class="right_icon">
                    <div class="img">
                        <van-action-bar-icon :icon="isCollected ? 'like' : 'like-o'" :text="isCollected ? '已收藏' : '收藏'"
                            @click="onCollection" />
                        <span>{{ list.statuscount ?? 0 }}</span>
                    </div>
                    <div class="img">
                        <img src="/assets/images/rate-icon.png" alt="">
                        <span>999</span>
                    </div>
                    <div class="img">
                        <img src="/assets/images/share-icon.png" alt="">
                    </div>
                </div>
            </div>
            <!-- 商品信息 -->
            <div class="goods">
                <div class="goods_info">
                    <div class="img">
                        <img :src="list.product.thumbs_list" alt="">
                    </div>
                    <div class="content">
                        <div class="title">
                            {{ list.product.name }}
                        </div>
                        <div class="content_footer">
                            <div class="price">
                                <span>￥{{ list.price }}</span>
                            </div>
                            <div class="content_btn">
                                <a href="./detail.html">立即购买</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <Footer />
</template>
<script setup>
import Footer from '@/components/common/footer.vue';

const { proxy } = getCurrentInstance();
const LoginUser = reactive(proxy.$cookies.get("LoginUser"));
import { showSuccessToast } from "vant";
import { ref } from 'vue';
const list = ref({
    product: {}
})
onBeforeMount(() => {
    getSearchInfoData()
})
const getSearchInfoData = async () => {
    let result = await Api.SearchIndex({
        busid: LoginUser.id,
    })
    if (result.code === 1) {
        list.value = result.data
        console.log(list.value)
    }
}
const onCollection = async () => {
    let result = await Api.SearchCollection({
        busid: LoginUser.id,
    });
    if (result.code == 1) {
        console.log(result);
        showSuccessToast({
            message: result.msg,
            // 切换收藏状态
        });
        isCollected.value = !isCollected.value;
    } else {
        showSuccessToast(result.msg);
    }
}
</script>
<style scoped>
@import url(/assets/css/find.css);
</style>